<template>
	<view class="content" v-if="data.utype == 1">
		<view v-if="data.jobIntention.length == 0">
			<u-navbar :is-back="false" :border-bottom="false" :background="{ background: '#00D075' }" title="推荐"
				title-color="#fff"></u-navbar>
			<view class="content_nojob">
				<u-image class="u-m-b-48" src="/static/home/job.png" width="300" height="228"></u-image>
				<view class="u-m-b-30">
					发布职位后才会为您精准推荐更多求职
					者，快去发布吧！
				</view>
				<view class="content_nojob_btn" @click="$u.throttle(toPostJob, 1000)">
					发布职位
				</view>
			</view>
		</view>
		<view v-if="data.jobIntention.length != 0">

			<view class="content_navbar">
				<!-- 导航栏 -->
				<u-navbar :is-mp-wx="true" :is-back="false" :border-bottom="false"
					:background="{ background: '#00D075' }">
					<template v-slot:content>
						<u-tabs active-color="#fff" inactive-color="#fff" :bg-color="'transparent'" :show-bar="false"
							:list="data.jobIntention" v-model="data.jobIntentionCurrent" @change="change"></u-tabs>
					</template>
					<template v-slot:right>
						<view class="u-flex">
							<u-icon name="plus" color="#fff" size="48" @click="toPostJob"></u-icon>
							<u-line margin="0 20rpx" :hair-line="false" length="50rpx" direction="col"
								color="#fff"></u-line>
							<u-icon name="search" color="#fff" size="48" @click="toSearch"></u-icon>
						</view>
					</template>
				</u-navbar>
				<!-- 筛选 -->
				<view class="content_screen u-border-bottom u-flex u-row-between">
					<u-tabs active-color="#101010" inactive-color="#101010" :show-bar="false" :list="data.screenTabs"
						v-model="data.screenCur" @change="screenChange"></u-tabs>
				</view>
			</view>
			<!-- 简历列表 -->
			<u-resume-list :height="data.height" :params="data.params"></u-resume-list>
		</view>

	</view>
	<view class="content" v-if="data.utype == 2">
		<view class="content_navbar">
			<!-- 导航栏 -->
			<u-navbar :is-mp-wx="true" :is-back="false" :border-bottom="false" :background="{ background: '#00D075' }">
				<template v-slot:content>
					<u-tabs active-color="#fff" inactive-color="#fff" :bg-color="'transparent'" :show-bar="false"
						:list="data.jobIntention" v-model="data.jobIntentionCurrent" @change="change"></u-tabs>
				</template>
				<template v-slot:right>
					<view class="u-flex">
						<u-icon name="plus" color="#fff" size="48" @click="toJobIntention"></u-icon>
						<u-line margin="0 20rpx" :hair-line="false" length="50rpx" direction="col"
							color="#fff"></u-line>
						<u-icon name="search" color="#fff" size="48" @click="toSearch"></u-icon>
					</view>
				</template>
			</u-navbar>
			<!-- 搜索条件 -->
			<view class="content_screen u-border-bottom u-flex u-row-between">
				<u-tabs active-color="#101010" inactive-color="#101010" :show-bar="false" :list="data.screenTabs"
					v-model="data.screenCur" @change="screenChange"></u-tabs>
				<view v-if="data.address" class="content_screen_item u-flex" @click="chooseLocation">
					<u-icon class="u-m-r-5" name="map" size="30" top="2"></u-icon>
					<text class="u-line-1">{{data.address}}</text>
				</view>
			</view>
		</view>
		<!-- 职位列表 -->
		<u-job-list :height="data.height" :params="data.params"></u-job-list>

		<u-purview-modal v-model="data.isJurisdiction" purviewName="定位"
			@cancel="data.isJurisdiction=false"></u-purview-modal>
	</view>

	<!-- 发布职位 -->
	<u-modal v-model="data.isJobNum" title="系统提示"
		:content="`您当前是${data.setmeal_name}，当前可发布职位数为0，建议您立即升级套餐或将暂时不招聘的职位设为关闭`" confirmText="升级套餐" showCancelButton
		@confirm="uploadPackage"></u-modal>
</template>

<script setup>
	import {
		ref,
		reactive,
		getCurrentInstance,
		nextTick,
		computed,
		watch,
	} from 'vue';
	import {
		onReady,
		onShow
	} from '@dcloudio/uni-app'
	import {
		useUserStore
	} from '/stores/userInfo.js'
	import {
		useUserIm
	} from '/stores/userIm.js'
	import {
		storeToRefs
	} from 'pinia'
	import config from '/config/productions'
	import permision from "@/js_sdk/permission/permission.js"
	const data = reactive({
		jobIntention: [],
		jobIntentionCurrent: 0,
		screenTabs: [],
		screenCur: 0,
		// 列表展示高度
		height: '',
		// 列表查询条件
		params: {},
		// 附近位置信息
		address: '',
		isJurisdiction: false,
		customStyle: {
			backgroundColor: '#00D075',
			color: "#fff",
			border: 'none',
			width: '312rpx'
		},
		// 发布职位弹窗
		isJobNum: false,
		setmeal_name: ''
	})
	const {
		isLogin
	} = storeToRefs(useUserStore())
	const IM = useUserIm()
	watch(
		() => [IM.messagelist, IM.IsUpdataChatList], (nv) => {
			if (nv[0] || nv[1] != 0) {
				if (isLogin.value) {
					IM.getUserList()
				}
			}
		}, {
			immediate: true,
			deep: true
		}
	)
	onShow(() => {
		data.utype = uni.getStorageSync('utype')
		if (isLogin.value) {
			IM.getUserList()
		}
		if (data.utype == 1) {
			getJobList()
		} else {
			getIntentionList()
		}
	})
	// 去升级套餐
	const uploadPackage = () => {
		uni.$u.route('/pages/pagesPersonal/toolMall/package')
	}
	// 跳转发布职位页面
	const toPostJob = async () => {
		// 是否登录 登录正常跳转 未登录跳转登录页
		if (isLogin.value) {
			// 判断企业是否认证 认证正常跳转 未认证跳转认证页面
			let authType = await uni.$u.api.company_authinfo() // 获取企业认证状态
			if (authType.audit != 1) return uni.$u.route('pages/pagesPersonal/set/auth/auth')
			let res = await uni.$u.api.checkJobaddNumber()
			if (res.enable_addjob_num <= 0) {
				data.setmeal_name = res.setmeal_name
				data.isJobNum = true
				return
			}
			uni.$u.route('/pages/pagesPersonal/job/jobEdit/jobEdit')
		} else {
			uni.$u.route('pages/login/login')
		}
	}
	// 获取职位列表
	const getJobList = async () => {
		data.screenTabs = [{
			name: '推荐',
			index: 4
		}, {
			name: '最新',
			index: 1
		}]
		// 判断当前是否登录 登录展示求职意向列表并展示相关列表信息 未登录展示推荐列表
		if (isLogin.value) {
			try {
				let res = await uni.$u.api.getRecommendJobList()
				if (res.items && res.items.length > 0) {
					data.jobIntention = res.items.map(item => {
						return {
							...item,
							name: item.jobname
						}
					})
					data.params.sort_type = data.screenTabs[data.screenCur].index
					data.params.id = data.jobIntention[data.jobIntentionCurrent].id
					data.params.jobname = data.jobIntention[data.jobIntentionCurrent].jobname
					setTimeout(() => {
						getListHeight()
					}, 20)
				}
			} catch (e) {
				uni.getStorageSync('next_code', e.code)
			}

		} else {
			data.jobIntention = []
		}
	}
	// 获取求职意向列表
	const getIntentionList = async () => {
		data.screenTabs = [{
			name: '推荐',
			index: 4
		}, {
			name: '附近',
			index: 3
		}]
		// 判断当前是否登录 登录展示求职意向列表并展示相关列表信息 未登录展示推荐列表
		if (isLogin.value && uni.getStorageSync('next_code') != 50007) {
			let res = await uni.$u.api.getIntentionList()
			if (res.items) {
				data.jobIntention = res.items.map(item => {
					return {
						...item,
						name: item.category_text
					}
				})
				data.params.type = data.screenTabs[data.screenCur].index
				data.params.category1 = data.jobIntention[data.jobIntentionCurrent].category1
				data.params.category2 = data.jobIntention[data.jobIntentionCurrent].category2
				data.params.category3 = data.jobIntention[data.jobIntentionCurrent].category3
			}
		} else {
			data.jobIntention = [{
				name: '推荐',
				id: 0
			}]
			data.params.type = data.screenTabs[data.screenCur].index
			data.params.intention_id = data.jobIntention[0].id
		}
		setTimeout(() => {
			getListHeight()
		}, 20)
	}
	const instance = getCurrentInstance(); // 获取组件实例
	// 获取列表展示高度
	const getListHeight = () => {
		const query = uni.createSelectorQuery().in(instance);
		query.select('.content_navbar').boundingClientRect(res => {
			if (res) {
				data.height = (uni.$u.sys().windowHeight - res.height) + 'px'
			}
		}).exec();
	}
	const chooseLocation = () => {
		uni.chooseLocation({
			latitude: data.params.lat,
			longitude: data.params.lon,
			success: (res) => {
				data.address = res.name ? res.name : res.address
				data.params.lat = res.latitude
				data.params.lon = res.longitude
			}
		});
	}
	// 点击切换推荐 附近 最新
	const screenChange = async (index) => {
		data.address = ''
		if (index == 1 && data.utype == 2) {
			// #ifdef H5
			uni.getLocation({
				type: 'wgs84',
				success(res) {
					data.params.lat = res.latitude
					data.params.lon = res.longitude
					getGeoCodeData(res.latitude, res.longitude)
				}
			})
			// #endif
			// #ifdef MP-WEIXIN
			uni.getLocation({
				type: 'wgs84',
				success(res) {
					data.params.lat = res.latitude
					data.params.lon = res.longitude
					getGeoCodeData(res.latitude, res.longitude)
				}
			})
			// #endif
			// #ifdef APP-PLUS
			if (uni.$u.os() == 'ios') {
				var location = await permision.judgeIosPermission("location") //位置
			} else {
				var location = await permision.requestAndroidPermission(
					"android.permission.ACCESS_FINE_LOCATION"); //位置
			}
			if (location == true || location == 1) {
				uni.getLocation({
					type: 'wgs84',
					success(res) {
						data.params.lat = res.latitude
						data.params.lon = res.longitude
						getGeoCodeData(res.latitude, res.longitude)
					}
				})
			} else {
				data.isJurisdiction = true;
			}
			// #endif
		}
		data.screenCur = index
		if (data.utype == 1) {
			data.params.sort_type = data.screenTabs[index].index
		} else {
			data.params.type = data.screenTabs[index].index
		}
	}
	// 根据经纬度获取地址
	const getGeoCodeData = (lat, lon) => {
		uni.request({
			url: 'https://restapi.amap.com/v3/geocode/regeo',
			data: {
				key: config.WEBAK,
				location: `${lon},${lat}`,
				radius: 100

			},
			success: (res) => {
				let township = res.data.regeocode.addressComponent.township
				let address = res.data.regeocode.formatted_address
				data.address = address.substr(address.indexOf(township) + township.length, address
					.length)
			}
		});
	}
	// 去搜索页面
	const toSearch = () => {
		uni.$u.route('pages/pagesHome/search/index')
	}
	// 去求职意向界面
	const toJobIntention = () => {
		// 是否登录 登录正常跳转 未登录跳转登录页
		if (isLogin.value) {
			uni.$u.route('pages/pagesHome/jobIntention/index')
		} else {
			uni.$u.route('pages/login/login')
		}
	}
	// 点击切换求职意向
	const change = (index) => {
		data.jobIntentionCurrent = index
		if (data.utype == 1) {
			data.params.id = data.jobIntention[index].id
			data.params.jobname = data.jobIntention[index].jobname
		} else {
			data.params.category1 = data.jobIntention[index].category1
			data.params.category2 = data.jobIntention[index].category2
			data.params.category3 = data.jobIntention[index].category3
		}
	}
</script>

<style scoped lang="scss">
	.content {

		&_nojob {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			color: #8a8888;
			font-size: 28rpx;
			width: 500rpx;
			margin: 0 auto;
			text-align: center;
			padding-top: 50%;

			&_btn {
				background-color: #00D075;
				color: #fff;
				width: 310rpx;
				border-radius: 50rpx;
				height: 75rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 30rpx;
			}
		}

		&_navbar {

			:deep(.u-navbar) {
				padding: 0 30rpx !important
			}
		}

		&_screen {
			width: 90vw;
			margin: 0 auto;

			&_item {
				margin-left: 20rpx;
				padding: 10rpx 20rpx;
				border-radius: 10rpx;
				font-size: 26rpx;
				width: 200rpx;
				background-color: #00D075;
				color: #fff;
			}
		}
	}
</style>